<!-- https://passport.baidu.com/static/passpc-account/img/reg_bg_min.jpg -->
<!-- https://passport.baidu.com/static/passpc-account/img/baidu.png -->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .box {
            background-image: url(./reg_bg_min\ \(1\).jpg);
            position: fixed;
            left: 0;
             right: 0;
             top: 0;
             bottom: 0;
             background-size: cover;
        }

        .big {
            /* border: 1px solid red; */
            width: 100%;
            height: 716.6px;
        }

        .big-1 {
            /* border: black 1px solid; */
            /* width: 200px; */
            /* height: 40px; */
            margin-top: 50px;
            margin-left: 70px;
        }

        .big-2 {
            /* border: black solid 1px; */
            width: 322.3px;
            height: 75px;
            margin-left: 195px;
            margin-top: 160px;
        }

        .big-3 {
            /* border: black solid 1px; */
            width: 350px;
            height: 70px;
            margin-left: 220px;
            margin-top: 55px;
        }

        .body-right {
            float: right;
            width: 455px;
            height: 486px;
            background-color: white;
            margin-right: 180px;
            margin-top: -350px;
            border-radius: 10px;
        }

        .body-right-next {
            display: inline;
            margin-top: -10px;
            /* border: 1px solid black; */
        }

        .inp {
            width: 242px;
            height: 35px;
            border: 1px solid #ccc;
        }

        .safe {
            padding-left: 170px;
        }

        .safe em {
            padding: 0 12px;
            color: #fff;
        }

        .ruo {
            background-color: #de1111;
        }

        .zhong {
            background-color: #40b83f;
        }

        .qiang {
            background-color: #f79100;
        }

        .agree {
            padding-left: 95px;
            margin-left: -9%;
        }

        .agree input {
            vertical-align: middle;
            /*垂直样式居中*/
        }

        .agree a {
            color: #1ba1e6;
        }

        .btn {
            width: 80%;
            height: 50px;
            background-color: rgb(92, 164, 247);
            font-size: 14px;
            color: #fff;
            /* margin: 30px 0 0 70px; */
            border-radius: 20px;
        }

        li {
            margin-top: 20px;
            list-style: none;
        }
    </style>
</head>

<body>
    <div class="box">
        <div class="big">
            <div class="big-1">
                <!-- <img src="./8CU9X4E}ASG_YH9CD408JU1.png" width="150px" alt=""> -->
                <h1 style="color: rgb(4, 4, 75); font-size: 45px; margin-top: 0px;"><strong>汽车之家</strong></h1>
            </div>
            <div class="big-2">
                <h3 style="color: white; font-size: 55px;">汽车之家</h3>
            </div>
            <div class="big-3">
                <p style="color: white; font-size: 30px;">量身订购属于自己的爱车</p>
            </div>
            <div class="body-right">
                <div>
                    <h3 style="font-size: 40px; margin-left: 9%; margin-top: 20px; margin-bottom: 0;">欢迎登录</h3>
                </div>
                <div>
                    <p class="body-right-next" style="margin-left: 9%;">没有账号？</p><a href="./a.html"
                        class="body-right-next">注册</a>
                </div>
                <div>
                    <form action="">
                        <ul>
                            <li><label for="">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp账号：</label> 
                                <input type="text" placeholder="请输入账号" maxlength="11" class="inp"> </li>
                            <!-- <li><label for="">&nbsp&nbsp&nbsp验证码：</label> <input type="text" placeholder="请输入验证码" class="inp"></li> -->
                            <li><label for="">登录密码：</label> <input type="password" class="inp" placeholder="请设置登录密码"></li>
                            <li class="safe">安全程度 <em class="ruo">弱</em> <em class="zhong">中</em> <em
                                    class="qiang">强</em> </li>
                            <li><label for="">确认密码：</label> <input type="password" class="inp"placeholder="再次输入密码"></li>
                            <li style="margin-left: 9%;margin-top: 30px;">
                                <input type="submit" value="完成注册" class="btn" >
                            </li>
                            <li class="agree"><input type="checkbox" name="" id="">
                                同意协议并注册 <a href="#">《知晓用户协议》</a>
                            </li>
                        </ul>
                    </form>
                </div>
            </div>

        </div>
    </div>
    </div>
</body>

</html>